import { Component, OnInit, ViewChild, Injector, AfterViewInit } from '@angular/core';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { SelectItem } from 'primeng/api';
import { AppComponentBase } from '@shared/common/app-component-base';
import { Table } from 'primeng/table';
import { Paginator, LazyLoadEvent } from 'primeng/primeng';
import { WorkingHourServiceProxy, EmployeeSalaryServiceProxy, EmployeeSalaryDto } from '@shared/service-proxies/service-proxies';
//import { ExcelModalComponent } from '@app/shared/common/excel-modal/excel-modal.component';
import * as moment from 'moment';
import { BsDatepickerViewMode } from 'ngx-bootstrap/datepicker/models';
import { BsDatepickerConfig, BsDaterangepickerConfig } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';
import * as G2 from '@antv/g2';



@Component({
  selector: 'app-my-salary',
  templateUrl: './my-salary.component.html',
  styleUrls: ['./my-salary.component.css'],
  animations: [appModuleAnimation()]
})
export class MySalaryComponent  extends AppComponentBase implements AfterViewInit {
  ngAfterViewInit(): void {
    this.getMySalaryList();
    this.chartData();
  }

  @ViewChild('dataTable') dataTable: Table;

  salary: EmployeeSalaryDto[];
  amount = 0;
  title = 'app';
  data = {};
  chart ;
  graph;
  constructor(
    injector: Injector ,
    private _employeeSalaryServiceProxy: EmployeeSalaryServiceProxy
    ) 
    {
        super(injector);
       
    }


  getMySalaryList() {
    this._employeeSalaryServiceProxy.getAllByCurrentUser(
      "4",1000,0
      ).pipe(finalize(() => this.primengTableHelper.hideLoadingIndicator()))
      .subscribe(result => {
        this.salary = result.items;

        result.items.forEach(element => {
          this.amount = this.amount+element.takeHomeAmount;
        });
        
      })
  }
  
  
  
  chartData() {
    this.data = [
     { genre: 'Sports', sold: 275 ,color:'#00c5dc'},
     { genre: 'Strategy', sold: 115 ,color:'#3ab994'},  
     { genre: 'Action', sold: 120 ,color:'#3ab994'},
     { genre: 'Shooter', sold: 350 ,color:'#3ab994'},
     { genre: 'Other', sold: 150 ,color:'#3ab994'}
   ];
    this.chart = new G2.Chart({
     container: 'c1', // 指定图表容器 ID
     //forceFit : true,
     height : 130,
     width : 400,
     padding: 'auto',
     animate: true,
   });
   this.chart.axis(false);
   this.chart.legend(false);
   this.chart.source(this.data);
   this.chart.interval().position('genre*sold');
   //  渲染图表
   this.chart.render();
 }

    
}